*{
	margin: 0px;
	padding: 0px;
}
.box{
	margin: 0 auto;
	width: 560px;
	height: 560px;
	padding: 10px;
	position: relative;
	border: 1px solid red;
	
}
.sbox{
	width: 100px;
	height: 100px;
	border-radius: 10px;
}
.box1,.box2,.box3,.box4,.box5{
	margin: 10px;
	background-color: #66cd00;
}
.box4,.box5{
	position:relative ;
	top:-220px;
	left:220px;
}
.box6,.box7,.box8{
	position: relative;
	top: -330px;
}
.box9,.box10{
	position: relative;
	top: -550px;
	left: 110px;
}
.box1{
	position:relative ;
	left:110px;
}
.box2{
	position:relative ;
	top:-110px;
	left:220px;
}
.box3{
	position:relative ;
	top:-220px;
	left:330px;
}
.box8{
	border-bottom-left-radius:70px ;
}
.box12{
	border-bottom-right-radius:70px ;
}
.box6{
	margin: 10px;
	background-color: #8168ea;
	position: relative;
	top: -330px;
}
.box7{
	margin: 10px;
	background-color: #e86a80;
}
.box8{
	margin: 10px;
	background-color: #1ec0ff;
}
.box9{
	margin: 10px;
	background-color: #face47;
}
.box10{
	margin: 10px;
	background-color:#86d335;
}
.box11{
	margin: 10px;
	background-color: #8168ea;
	position: relative;
	left: 330px;
	top:-660px
}
.box12{
	margin: 10px;
	background-color: #e86a80;
	position: relative;
	left: 440px;
	top:-770px;
}
.box13{
	margin: 10px;
	background-color: #1ec0ff;
	position: relative;
	left: 330px;
	top:-990px
	
}
.box14{
	margin: 10px;
	background-color: #86d335;
	position: relative;
	left: 440px;
	top:-1100px;
}
.box15{
	margin: 10px;
	background-color: #face47;
	position: relative;
	left: 440px;
	top:-1320px;
}
.bgbox{
	width: 100px;
	height: 20px;
	background-image: linear-gradient(to bottom,#ddefc1,#bfec8d,#b1e481);
	filter: blur(2px);
	border-radius:4px ;
}
.a{
	position: absolute;
	left: 130px;
	top:10px;
}
.b{
	position: absolute;
	left: 240px;
	top:10px;
}
.c{
	position: absolute;
	left: 350px;
	top:10px;
}
